<%@ page language="java" contentType="text/html; charset=UTF-8"
	trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>	

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>
<%@ taglib prefix="t" tagdir="/WEB-INF/tags" %>
<%
	String path = request.getContextPath();
%>

<t:genericpage nav="${nav}">  

    <jsp:attribute name="jsblock">
    
    <!-- 引用vue机器组件组件 -->
    <c:url var="urlVueJs" value="/include/js/vue.min.js" />
    <script type="text/javascript" src="${urlVueJs}"></script>
    <c:url var="urlVueJsTable" value="/include/lib/vuejs-table/vuejs-table.js" />
    <script src="${urlVueJsTable}"></script>
    <!-- html模板片段 -->
    <script type="text/x-template" id="mytable">
    	
    </script>
    <!-- 实际js -->
    <script type="text/javascript">

	</script>
    
    </jsp:attribute>
  
    <jsp:body>
			<div class="row">
				<div class="col-xs-12">
					<div class="box box-success">
						<div class="box-body">
							<table class="table table-bordered">
				                <tbody><tr>
				                  <th style="width: 10px">#</th>
				                  <th>任务</th>
				                  <th>进度</th>
				                  <th style="width: 40px">标签</th>
				                </tr>
				                <tr>
				                  <td>1.</td>
				                  <td>Update software</td>
				                  <td>
				                    <div class="progress progress-xs">
				                      <div class="progress-bar progress-bar-danger" style="width: 55%"></div>
				                    </div>
				                  </td>
				                  <td><span class="badge bg-red">55%</span></td>
				                </tr>
				                <tr>
				                  <td>2.</td>
				                  <td>Clean database</td>
				                  <td>
				                    <div class="progress progress-xs">
				                      <div class="progress-bar progress-bar-yellow" style="width: 70%"></div>
				                    </div>
				                  </td>
				                  <td><span class="badge bg-yellow">70%</span></td>
				                </tr>
				                <tr>
				                  <td>3.</td>
				                  <td>Cron job running</td>
				                  <td>
				                    <div class="progress progress-xs progress-striped active">
				                      <div class="progress-bar progress-bar-primary" style="width: 30%"></div>
				                    </div>
				                  </td>
				                  <td><span class="badge bg-light-blue">30%</span></td>
				                </tr>
				                <tr>
				                  <td>4.</td>
				                  <td>Fix and squish bugs</td>
				                  <td>
				                    <div class="progress progress-xs progress-striped active">
				                      <div class="progress-bar progress-bar-success" style="width: 90%"></div>
				                    </div>
				                  </td>
				                  <td><span class="badge bg-green">90%</span></td>
				                </tr>
				              </tbody>
				        	</table>			            
						</div>
			            <!-- /.box-body -->
		             </div>
				</div>
			</div>
    </jsp:body>    
</t:genericpage>